/*
 * @Author: your name
 * @Date: 2023-10-11 13:03:45
 * @LastEditTime: 2023-10-23 09:50:48
 * @LastEditors: Please set LastEditors
 * @Descripttion: In User Settings Edit
 * @FilePath: /bicycle-mobile-old/h5/src/pages/likeProductList/index.jsx
 */
import React, { useEffect, useState } from 'react'
import styles from './index.less'
import { useDispatch, useSelector } from 'dva'
import InViewPort from '../../components/InViewPort'
import BicycleCard from '../../components/bicycleCard'
import ReturnIndex from "../../components/returnIndex"

function Index() {
  const dispatch = useDispatch()
  const {
    likeProductList,
    userInfo
  } = useSelector(({ index }) => index)

  useEffect(() => {
    dispatch({
      type: 'index/apiGetLikeProductList',
      payload: {
        objectType: 'EXHIBIT',
        type:'COLLECTED',
        userId:  userInfo?.user?.id || ''
      }
    })
  }, [])

  function onProEnter() {
    // console.log('onProEnter')
  }
  return (
    <div className={styles.page}>
      <ReturnIndex/>
      <div className={styles.goods}>
        {
          likeProductList && likeProductList.map((item, index) => {
            const lestIndex = likeProductList.length - 1
            if (index == lestIndex) {
              return <InViewPort key={index} onEnter={onProEnter}>
                <BicycleCard obj={item.object} />
              </InViewPort>
            }
            return <BicycleCard obj={item.object} key={index} />
          })
        }
        {
          likeProductList && (likeProductList.length % 2 != 0) && <div className={styles.emptyLabel}></div>
        }
      </div>
    </div>
  )
}

export default Index
